使用CSS變量（也叫做CSS自定義屬性）可以讓你更靈活、更高效地管理樣式，從而提高代碼的可維護性和可重用性。當你需要在不同的地方重複使用相同的樣式值時，CSS變量特別有用。CSS變量允許你定義一個值，然後在整個樣式表中多次重複使用它。這樣，如果你需要更改某個全局樣式值，你只需改變變量的值，而不用逐個修改每個使用這個值的地方。
CSS變量語法
定義變量：
CSS變量使用兩個連字符（--）開頭來命名。變量一般定義在:root中，這樣它們可以在整個文檔中使用（:root是一個全局的選擇器，類似於HTML元素）。
使用變量：
使用var()函數來引用變量。
好處!!!
提高可維護性：
當需要調整某些樣式時，只需更改變量的值，而不必到處修改具體的樣式定義。比如說，改變主色調只需改變 --primary-color 這一行。
提高一致性：
可以在多個地方使用相同的變量，保證設計風格的一致性。例如，頁面中不同的標題、按鈕、背景顏色等都可以用--primary-color，確保主色統一。
動態樣式調整：
可以結合 JavaScript 來動態修改CSS變量，實現主題切換等功能。例如，夜間模式和日間模式可以通過修改變量來實現而不必重新寫樣式。